<template>
  <div class="report-title">
    <div class="report-title-search">
      <vxe-input
        v-model="inputSearch"
        type="search"
        placeholder="试试全表搜索"
        @keyup="inputSearchKey"
      />
    </div>
    <div class="report-title-word">{{ reportTitleWord }}</div>
  </div>
</template>

<script>
import { getToken } from '@/utils/auth.js';
export default {
  name: 'ReportTitle',
  props: {
    reportTime: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      inputSearch: '',
      reportTitleWord: ''
    };
  },

  watch: {
    reportTime() {
      this.inputSearch = '';
    }
  },

  mounted() {
    this.reportTitleWord = getToken('siderName');
  },

  methods: {
    inputSearchKey() {
      this.$emit('inputSearchKey', this.inputSearch);
    }
  }
};
</script>

<style lang="scss" scoped>
.report-title {
    text-align: center;
    position: relative;
    font-size: 24px;
    height: 50px;
    font-weight: bolder;
    font-family: PingFangSC, PingFangSC-Medium;
    .report-title-search {
      position: absolute;
      left: 0;
    }
  }
</style>
